<nz-card [nzTitle]="l('VerifySecurityCode')">
    <form nz-form #twoFactorForm="ngForm" method="post" novalidate (ngSubmit)="submit()" role="form" *ngIf="loginService.authenticateResult">
        <nz-alert class="mb-md" nzType="info" nzCloseable [nzMessage]="l('SendSecurityCode_Information')" nzShowIcon>
        </nz-alert>
        <nz-form-item>
            <nz-form-control [nzErrorTip]="passwordValidationTpl">
                <input nz-input #passwordInput="ngModel" autoFocus [(ngModel)]="code" type="password" autocomplete="off"
                    placeholder="{{'Code' | localize}} *" name="code" required maxlength="16" />
                <ng-template #passwordValidationTpl let-control>
                    <validation-messages [formCtrl]="control"></validation-messages>
                </ng-template>
            </nz-form-control>
        </nz-form-item>
        <nz-form-item>
            <nz-form-control>
                <label nz-checkbox [(ngModel)]="loginService.authenticateModel.rememberClient" name="rememberClient">{{"RememberThisBrowser" | localize}}</label>
            </nz-form-control>
        </nz-form-item>
        <nz-form-item>
            <button nz-button nzType="primary" nzSize="large" type="submit" [disabled]="!twoFactorForm.form.valid" nzBlock>{{"Submit" | localize}}</button>
            <span class="remaining-time-counter" *ngIf="remainingSeconds >= 0">{{"RemainingTime" | localize}}:
                {{"SecondShort{0}" | localize:remainingSeconds}}.</span>
        </nz-form-item>
    </form>
</nz-card>